/* login pages */

.login-container {
  width:375px;
  margin:0 auto;
}

.login-layout {
 background:#1D2024;
 &:before {
	display:none;
 }

 #main-content {
	margin-left:0;
	min-height:100%;
 }
 
 input[type="text"],
 input[type="password"],
 input[type="datetime"],
 input[type="datetime-local"],
 input[type="date"],
 input[type="month"],
 input[type="time"],
 input[type="week"],
 input[type="number"],
 input[type="email"],
 input[type="url"],
 input[type="search"],
 input[type="tel"],
 input[type="color"] {
	line-height:32px;
	height:32px; max-height:32px;
	margin-bottom:4px;/* default is 10 */
 }
 
 label {
	margin-bottom:11px;
 }
 
 
 
 .widget-box {
	visibility:hidden;
	position:absolute;	 
	overflow:hidden;
	width:100%;
	 
	border-bottom:none;
	box-shadow:none;
	padding:6px;
	background-color:#394557;
	 
	.transform(~"scale(0,1) translate(-150px)");	
	&.visible {
		visibility:visible;
		.transform(~"scale(1,1) translate(0)");

		.transition(~"all .3s ease");
		-o-transition: none;/* too slow */
		-webkit-transition: none;/* works in chrome but not in safari, never scales back to 1! */
	}
	
	.widget-main {
		padding:16px 36px 36px;
		background:#F7F7F7;
		form {
			margin:0;
		}
	}
	.widget-body .toolbar > div > a {
		font-size:15px;
		font-weight:400;
		text-shadow:1px 0px 1px rgba(0,0,0,0.25); 
	}
 }
 
 
}




#login-box {
  .forgot-password-link { color:#FE9; }
  .user-signup-link { color:#CF7; }
  
  .toolbar {
	background:#5090C1;
	border-top:2px solid #597597;
	> div {
		width:50%;
		display:inline-block;
		padding:9px 0 11px;

		&:first-child {//the first link
			float:left;
			text-align:left;
			> a {
				margin-left:11px;
			}
			
			+ div {//the next one
				float:right;
				text-align:right;
				> a {
					margin-right:11px;
				}
			}
		}
	}
  }
}




#forgot-box .toolbar {
 background:#C16050;
 border-top:2px solid #976559;
 padding:9px 18px;
}

#signup-box  .toolbar {
 background:#76B774;
 border-top:2px solid #759759;
 padding:9px 18px;
}

#forgot-box .back-to-login-link  , #signup-box .back-to-login-link{
 color:#FE9;
 font-size:14px;
 font-weight:bold;
 text-shadow:1px 0px 1px rgba(0,0,0,0.25); 
}